<template>
    <div class="content">
        <p v-if="!hasAgent">
            您好！如需购买房卡请联系您所在群的群主进行购买。 如需客户服务请添加公众号“益友棋牌”。
        </p>
        <div class="agent" v-if="hasAgent">
            <h1>代理名称</h1>
            <ul class="agent_list">
                <li class="agent_list_item" v-for="agent in agentList" :key="agent.user_id">
                    <span>{{agent.nickname}}</span>
                    <a class="agent_buy" v-bind:href="buyHref" v-on:click="buyCards(agent.user_id)">购买</a>
                </li>
            </ul>
        </div>
    </div>
</template>


<script>
import axios from "axios";
import utils from "../../scripts/utils";

export default {
  data: function() {
    return {
      hasAgent: false,
      agentList: [1, 3, 4],
      allData: {},
      buyHref: "#"
    };
  },
  created: function() {
    let uid = utils.getUrlString("uid");
    axios
      .post("/api/mobile/agentList")
      .then(res => {
        let data = res.data;
        this.allData = data;
        this.agentList = data.agentList;
        // 有代理则显示代理
        this.agentList.length > 0 && (this.hasAgent = true);
      })
      .catch(err => {
        console.log(err);
      });
  },
  methods: {
    buyCards(user_id) {
      // 买卡链接
      let buyURL = `${this.allData
        .urlhost}/index.php/Mobile/User/salecard/uid/${user_id}/playerid/${this
        .allData.playerID}.html`;
      this.buyHref =
        "native://?action=openurl&url=" + encodeURIComponent(buyURL);
    }
  }
};
</script>


<style scoped>
.content {
  height: 100%;
  background: url("../images/bg.png") no-repeat;
  background-size: 100% 100%;
  color: #fff;
  padding: 10px;
}

p {
  font-size: 0.35rem;
}

.agent {
  font-size: 0.35rem;
}

.agent h1 {
  border-bottom: 1px solid #4a7085;
  font-size: 0.35rem;
  line-height: 0.8rem;
  padding-left: 0.3rem;
}

.agent_list_item {
  border-bottom: 1px solid #4a7085;
  display: flex;
  justify-content: space-between;
}

.agent_list_item span,
.agent_list_item a {
  margin: 0.3rem;
}

.agent_buy {
  background: url("../images/konganniu3.png") center no-repeat;
  background-size: 100% 100%;
  width: 1.5rem;
  font-size: 0.35rem;
  height: 0.6rem;
  line-height: 0.5rem;
  color: #fff;
  text-align: center;
}
</style>


